<template>
  <card-vue title="标签列表">
    <i class="el-icon-s-data" slot="title-icon"></i>
    <div slot="body" class="tag-wrap">
      <el-tag size="medium" v-for="(item,k) in tagList" :key="k" :type="item.type">{{item.tag}}</el-tag>
    </div>
  </card-vue>
</template>

<script>
  import {queryTags} from "../assets/api/getData";

  export default {
    name: "tagList",
    data() {
      return {
        tagList: [],
      }
    },
    created() {
      this.getTagList();
    },
    methods: {
      async getTagList() {
        let {data} = await queryTags();
        this.tagList = data;
        let typeList = ['', 'success', 'info', 'danger', 'warning'];
        this.tagList.forEach(item => {
          let num = Math.floor(Math.random() * 5);
          item.type = typeList[num]
        })
      }
    }
  }
</script>

<style lang="less" scoped>

</style>
